Recherche avancée

Sur d’autres sites (14938)

• How to measure the performance of a newsletter (or any email) with Matomo

  19 décembre 2017, par InnoCraft

  To be able to grow your business, it is crucial to track all your marketing efforts. This includes all newsletters and emails that you share with people outside of your business. Otherwise, you won’t be able to know which of your daily efforts are yielding results.

  Are you wondering if it is possible to track the performance of an emailing campaign in Matomo (Piwik) efficiently ? Would you like to know if it is technically easy ? No worries, here is a “How to” tutorial showing you how easily you can track an emailing in Matomo properly.

  Different tracking levels for different needs

  There are many things that you may be interested to track, for example :

  

  1. How many users opened your email
  2. How many users interacted with the links in your email
  3. How many users interacted on your website through your email

  Let’s have a look at each of these levels.

  Step 1 – Tracking email and newsletter openings in Matomo

  Tracking email openings requires to add an HTML code to your newsletter. It works through what we call a tracking pixel, a tiny image of 1×1 that is transparent so the user will not be able to see it.
  In order to install it, here is an example of what this code looks like :

  <img src="https://piwik.example.com/piwik.php?idsite=YOUR_PIWIK_WEBSITE_ID&rec=1&bots=1&url=https%3A%2F%2Fexample.com%2Femail-opened%2Fnewsletter_XYZ&action_name=Email%20opened&_rcn=internal%20email%20name&_rck=newsletter_XYZ" style="border:0;” alt="" />

  The Matomo tracking pixel explained

  The above URL is composed of the following URL parameters which are part of our Tracking API :

  • idsite : Corresponds to the ID of the website you would like to track.
  • rec : You need to have rec=1 in order for the request to be actually recorded.
  • bots : Set it to 1 to include all the connections made to this request, bots included.
  • url : corresponds to the URL you would like to display in Matomo (Piwik) every time the email is opened.
  • action_name : This is the page name you would like to be tracked when the email is opened.
  • _rcn : The name you would like to give to your campaign.
  • _rck : The keyword you may like to use in order to summarize the content of your newsletter.

  You may have noticed some special characters here such as “%20”, “%2F”. That’s because the URL is encoded. We strongly recommend you to do so in order for your tracking not to break. Many tools are available on the web in order to encode your URLs such as https://www.urlencoder.org/.

  If you would like to access the previous tracking code easily, keep in mind that you can always find the tracking code generator within the “Matomo admin panel → Tracking code” :

  

  You can find more information about it on our guide at : How do I track how many users open and read my newsletter emails (using a pixel / beacon) ?

  As a result, the information will be pushed as following for any user who opens your email :

  

  To not bias your regular page views on your website with newsletter openings, we recommend tracking newsletter openings into a new website.

  Tracking even more data : the user ID example

  You can go deeper in your URL tracking by inserting other parameters such as the user id if you have this information within your emailing database. One of the main benefit of tracking the User ID is to connect data across multiple devices and browsers for a given user.

  You only need to add the following parameter &uid=XXX where XXX equals the dynamic value of the user ID :

  

  Make sure that UID from your emailing provider is the same as the one used on your website in order for your data to be consistent.

  Important note : some email providers are loading email messages by default which results in an opening even if the user did not actually open the email.

  Step 2 – Measure the clicks within your emailing

  Tracking clicks within an email lets you know with which content readers interacted the most. We recommend tracking all links in all your emails as a campaign, whether it is a newsletter, a custom support email, an email invoice, etc. You might be surprised to see which of your emails lead to conversions and if they don’t, try to tweak those emails, so they might in the future.

  Tracking clicks This works thanks to URL campaign tracking. In order to perform this action, you will need to add Matomo (Piwik) URL parameters to all your existing link URLs :

  • Website URL : for example “www.your-website.com”.
  • Campaign name : for example “pk_campaign=emailing”. Represents the name you would like to give to your campaign.
  • Campaign keyword : for example “pk_keyword=name-of-your-article”. Represents the name you would like to give to your content.
  • Campaign source : for example “pk_source=newsletter”. Represents the name of the referrer.
  • Campaign medium : for example “pk_medium=email”. Represents the type of referrer you are using.
  • Campaign content : for example “pk_content=title”. Represents the type of content.

  You can find more information about campaign url tracking in our “Tracking marketing campaigns with Matomo” guide.

  Here is a sample showing you how you can differentiate some links in a newsletter, all pointing to the same URL :

  

  Once you have added these URL parameters to each of your link, Matomo (Piwik) will clearly indicate the referrer of this specific campaign when a user clicks on a link in the newsletter and visits your website.

  Important note : if you do not track your campaigns, it will result in a bad interpretation of your data within Matomo (Piwik) as you will get webmail services or direct entries as referrer instead of your newsletter campaign.

  Step 3 – Measure emailing performances on your website

  Thanks to Matomo (Piwik) URL campaign parameters, you can now clearly identify the traffic brought through your emailing. You can now specifically isolate users who come from emails by creating a segment :

  

  Once done, you can either have a look at each user specifically through the visitor log report or analyze it as a whole within the rest of the reports.

  You can even measure your return on investment directly if goals have been defined. In order to know more about how to track goals within Matomo (Piwik).

  Did you like this article ?

  If you enjoyed reading this article, do not hesitate to share it around you. Moreover, if there are any topics you would like to write us about in particular, just drop us an email and we will be more than happy to write about it.

  The post How to measure the performance of a newsletter (or any email) with Matomo appeared first on Analytics Platform - Matomo.

• How to measure the performance of a newsletter (or any email) with Piwik

  19 décembre 2017, par InnoCraft — Community

  To be able to grow your business, it is crucial to track all your marketing efforts. This includes all newsletters and emails that you share with people outside of your business. Otherwise, you won’t be able to know which of your daily efforts are yielding results.

  Are you wondering if it is possible to track the performance of an emailing campaign in Piwik efficiently ? Would you like to know if it is technically easy ? No worries, here is a “How to” tutorial showing you how easily you can track an emailing in Piwik properly.

  Different tracking levels for different needs

  There are many things that you may be interested to track, for example :

  

  1. How many users opened your email
  2. How many users interacted with the links in your email
  3. How many users interacted on your website through your email

  Let’s have a look at each of these levels.

  Step 1 – Tracking email and newsletter openings in Piwik

  Tracking email openings requires to add an HTML code to your newsletter. It works through what we call a tracking pixel, a tiny image of 1×1 that is transparent so the user will not be able to see it.
  In order to install it, here is an example of what this code looks like :

  <img src="https://piwik.example.com/piwik.php?idsite=YOUR_PIWIK_WEBSITE_ID&rec=1&bots=1&url=https%3A%2F%2Fexample.com%2Femail-opened%2Fnewsletter_XYZ&action_name=Email%20opened&_rcn=internal%20email%20name&_rck=newsletter_XYZ" style="border:0;” alt="" />

  The Piwik tracking pixel explained

  The above URL is composed of the following URL parameters which are part of our Tracking API :

  • idsite : Corresponds to the ID of the website you would like to track.
  • rec : You need to have rec=1 in order for the request to be actually recorded.
  • bots : Set it to 1 to include all the connections made to this request, bots included.
  • url : corresponds to the URL you would like to display in Piwik every time the email is opened.
  • action_name : This is the page name you would like to be tracked when the email is opened.
  • _rcn : The name you would like to give to your campaign.
  • _rck : The keyword you may like to use in order to summarize the content of your newsletter.

  You may have noticed some special characters here such as “%20”, “%2F”. That’s because the URL is encoded. We strongly recommend you to do so in order for your tracking not to break. Many tools are available on the web in order to encode your URLs such as https://www.urlencoder.org/.

  If you would like to access the previous tracking code easily, keep in mind that you can always find the tracking code generator within the “Piwik admin panel → Tracking code” :

  

  You can find more information about it on our guide at : How do I track how many users open and read my newsletter emails (using a pixel / beacon) ?

  As a result, the information will be pushed as following for any user who opens your email :

  

  To not bias your regular page views on your website with newsletter openings, we recommend tracking newsletter openings into a new website.

  Tracking even more data : the user ID example

  You can go deeper in your URL tracking by inserting other parameters such as the user id if you have this information within your emailing database. One of the main benefit of tracking the User ID is to connect data across multiple devices and browsers for a given user.

  You only need to add the following parameter &uid=XXX where XXX equals the dynamic value of the user ID :

  

  Make sure that UID from your emailing provider is the same as the one used on your website in order for your data to be consistent.

  Important note : some email providers are loading email messages by default which results in an opening even if the user did not actually open the email.

  Step 2 – Measure the clicks within your emailing

  Tracking clicks within an email lets you know with which content readers interacted the most. We recommend tracking all links in all your emails as a campaign, whether it is a newsletter, a custom support email, an email invoice, etc. You might be surprised to see which of your emails lead to conversions and if they don’t, try to tweak those emails, so they might in the future.

  Tracking clicks This works thanks to URL campaign tracking. In order to perform this action, you will need to add Piwik URL parameters to all your existing link URLs :

  • Website URL : for example “www.your-website.com”.
  • Campaign name : for example “pk_campaign=emailing”. Represents the name you would like to give to your campaign.
  • Campaign keyword : for example “pk_keyword=name-of-your-article”. Represents the name you would like to give to your content.
  • Campaign source : for example “pk_source=newsletter”. Represents the name of the referrer.
  • Campaign medium : for example “pk_medium=email”. Represents the type of referrer you are using.
  • Campaign content : for example “pk_content=title”. Represents the type of content.

  You can find more information about campaign url tracking in our “Tracking marketing campaigns with Piwik” guide.

  Here is a sample showing you how you can differentiate some links in a newsletter, all pointing to the same URL :

  

  Once you have added these URL parameters to each of your link, Piwik will clearly indicate the referrer of this specific campaign when a user clicks on a link in the newsletter and visits your website.

  Important note : if you do not track your campaigns, it will result in a bad interpretation of your data within Piwik as you will get webmail services or direct entries as referrer instead of your newsletter campaign.

  Step 3 – Measure emailing performances on your website

  Thanks to Piwik URL campaign parameters, you can now clearly identify the traffic brought through your emailing. You can now specifically isolate users who come from emails by creating a segment :

  

  Once done, you can either have a look at each user specifically through the visitor log report or analyze it as a whole within the rest of the reports.

  You can even measure your return on investment directly if goals have been defined. In order to know more about how to track goals within Piwik.

  Did you like this article ?

  If you enjoyed reading this article, do not hesitate to share it around you. Moreover, if there are any topics you would like to write us about in particular, just drop us an email and we will be more than happy to write about it.

• Video streaming error : Uncaught (in promise) NotSupportedError : Failed to load because no supported source was found

  18 septembre 2024, par Aizen

  Here is my problem : I have one video src 1080p (on the frontend). On the frontend, I send this video-route to the backend :

  


  const req = async()=>{try{const res = await axios.get('/catalog/item',{params:{SeriesName:seriesName}});return {data:res.data};}catch(err){console.log(err);return false;}}const fetchedData = await req();-On the backend i return seriesName.Now i can make a full path,what the video is,and where it is,code:


  


  const videoUrl = 'C:/Users/arMori/Desktop/RedditClone/reddit/public/videos';console.log('IT VideoURL',videoUrl);


  


  const selectedFile = `${videoUrl}/${fetchedData.data.VideoSource}/${seriesName}-1080p.mp4`
console.log(`ITS'S SELECTED FILE: ${selectedFile}`);


  


  Ok, I have my src 1080p, now is the time to send it to the backend :

  


  const response = await axios.post('/videoFormat', {videoUrl:selectedFile})console.log('Это консоль лог путей: ',response.data);const videoPaths = response.data;


  


  Backend takes it and FFMpqg makes two types of resolution,720p and 480p,save it to the temp storage on backend, and then returns two routes where these videos stores

  


  async videoUpload(videoUrl:string){try{const tempDir = C:/Users/arMori/Desktop/RedditClone/reddit_back/src/video/temp;const inputFile = videoUrl;console.log('VIDEOURL: ',videoUrl);


  


          const outputFiles = [];&#xA;        &#xA;        await this.createDirectories(tempDir);        &#xA;        outputFiles.push(await this.convertVideo(inputFile, &#x27;1280x720&#x27;, &#x27;720p.mp4&#x27;));&#xA;        outputFiles.push(await this.convertVideo(inputFile, &#x27;854x480&#x27;, &#x27;480p.mp4&#x27;));&#xA;        console.log(&#x27;OUTUPT FILES SERVICE: &#x27;,outputFiles);&#xA;        &#xA;        return outputFiles;&#xA;&#xA;    }catch(err){&#xA;        console.error(&#x27;VideoFormatterService Error: &#x27;,err);&#xA;        &#xA;    }&#xA;}&#xA;&#xA;private convertVideo(inputPath:string,resolution:string,outputFileName:string):Promise<string>{&#xA;    const temp = `C:/Users/arMori/Desktop/RedditClone/reddit_back/src/video/temp`;&#xA;    return new Promise(async(resolve,reject)=>{&#xA;        const height = resolution.split(&#x27;x&#x27;)[1];&#xA;        console.log(&#x27;HIEGHT: &#x27;,height);&#xA;        &#xA;        const outputDir = `C:/Users/arMori/Desktop/RedditClone/reddit_back/src/video/temp/${height}p`;&#xA;        const outputPath = join(outputDir, outputFileName);&#xA;        const isExists = await fs.access(outputPath).then(() => true).catch(() => false);&#xA;        if(isExists){ &#xA;            console.log(`File already exists: ${outputPath}`);&#xA;            return resolve(outputPath)&#xA;        };&#xA;        ffmpeg(inputPath)&#xA;        .size(`${resolution}`)&#xA;        .videoCodec(&#x27;libx264&#x27;) // Кодек H.264&#xA;        .audioCodec(&#x27;aac&#x27;) &#xA;        .output(outputPath)&#xA;        .on(&#x27;end&#x27;,()=>resolve(outputPath))&#xA;        .on(&#x27;error&#x27;,(err)=>reject(err))&#xA;        .run()&#xA;            &#xA;    })&#xA;}&#xA;&#xA;private async createDirectories(temp:string){&#xA;    try{&#xA;        const dir720p = `${temp}/720p`;&#xA;        const dir480p = `${temp}/480p`;&#xA;        const dir720pExists = await fs.access(dir720p).then(() => true).catch(() => false);&#xA;        const dir480pExists = await fs.access(dir480p).then(() => true).catch(() => false);&#xA;        if(dir720pExists &amp;&amp; dir480pExists){&#xA;            console.log(&#x27;FILES ALIVE&#x27;);&#xA;            return;&#xA;        }&#xA;        if (!dir720pExists) {&#xA;            await fs.mkdir(dir720p, { recursive: true });&#xA;            console.log(&#x27;Папка 720p создана&#x27;);&#xA;        }&#xA;        &#xA;        if (!dir480pExists) {&#xA;            await fs.mkdir(dir480p, { recursive: true });&#xA;            console.log(&#x27;Папка 480p создана&#x27;);&#xA;        }&#xA;    } catch (err) {&#xA;        console.error(&#x27;Ошибка при создании директорий:&#x27;, err);&#xA;    }&#xA;}&#xA;</string>

  


  Continue frontentd code :

  


  let videoPath;

if (quality === '720p') {
        videoPath = videoPaths[0];
} else if (quality === '480p') {
        videoPath = videoPaths[1];
}

if (!videoPath) {
        console.error('Video path not found!');
        return;
}

// Получаем видео по его пути
console.log('VIDEOPATH LOG: ',videoPath);
    
const videoRes = await axios.get('/videoFormat/getVideo', { 
        params: { path: videoPath } ,
        headers: { Range: 'bytes=0-' },
        responseType: 'blob'
    });
    console.log('Video fetched: ', videoRes);
    const videoBlob = new Blob([videoRes.data], { type: 'video/mp4' });
    const videoURL = URL.createObjectURL(videoBlob);
    return videoURL;
    /* console.log('Видео успешно загружено:', response.data); */
    } catch (error) {
    console.error('Ошибка при загрузке видео:', error);
    }
}


  


  Here I just choose one of the route and make a new GET request (VideoRes), now in the controller in the backend, I'm trying to do a video streaming :

  


  @Public()
    @Get('/getVideo')
    async getVideo(@Query('path') videoPath:string,@Req() req:Request,@Res() res:Response){
        try {
            console.log('PATH ARGUMENT: ',videoPath);
            console.log('VIDEOPATH IN SERVICE: ',videoPath);
        const videoSize = (await fs.stat(videoPath)).size;
        const CHUNK_SIZE = 10 ** 6;
        const range = req.headers['range'] as string | undefined;
        if (!range) {
            return new ForbiddenException('Range не найденно');
        }
        const start = Number(range.replace(/\D/g,""));
        const end = Math.min(start + CHUNK_SIZE,videoSize - 1);

        const contentLength = end - start + 1;
        const videoStream = fsSync.createReadStream(videoPath, { start, end });
        const headers = {
            'Content-Range':`bytes ${start}-${end}/${videoSize}`,
            'Accept-Ranges':'bytes',
            'Content-Length':contentLength,
            'Content-Type':'video/mp4'
        }
        
        res.writeHead(206,headers);

        // Передаем поток в ответ
        videoStream.pipe(res);
        

        // Если возникнет ошибка при стриминге, логируем ошибку
        videoStream.on('error', (error) => {
            console.error('Ошибка при чтении видео:', error);
            res.status(500).send('Ошибка при чтении видео');
        });
        } catch (error) {
            console.error('Ошибка при обработке запросов:', error);
            return res.status(400).json({ message: 'Ошибка при обработке getVideo запросов' });
        }
    }


  


  Send to the frontend

  


  res.writeHead(206,headers);


  


  In the frontend, I make blob url for video src and return it

  


  const videoBlob = new Blob([videoRes.data], { type: 'video/mp4' });const videoURL = URL.createObjectURL(videoBlob);return videoURL;


  


  And assign src to the video :

  


  useVideo(seriesName,quality).then(src => {
                if (src) {
                    console.log('ITS VIDEOLOGISC GOIDA!');
                    if(!playRef.current) return;
                    
                    const oldURL = playRef.current.src;
                    if (oldURL && oldURL.startsWith('blob:')) {
                        URL.revokeObjectURL(oldURL);
                    }
                    playRef.current.pause();
                    playRef.current.src = '';
                    setQuality(quality);
                    console.log('SRC: ',src);
                    
                    playRef.current.src = src;
                    playRef.current.load();
                    console.log('ITS VIDEOURL GOIDA!');
                    togglePlayPause();
                }
            })
            .catch(err => console.error('Failed to fetch video', err));


  


  But the problem is :

  


  


  Vinland-Saga:1 Uncaught (in promise) NotSupportedError : Failed to load because no supported source was found

  


  


  And I don't know why...

  


  I tried everything, but I don't understand why src is incorrect..