項(xiàng)目中遇到的問(wèn)題:1.前臺(tái)為商品掃碼數(shù)據(jù)埋點(diǎn)(二維碼中的鏈接是外鏈,不是自己的后臺(tái)),如果直接放外鏈的話,是統(tǒng)計(jì)不到數(shù)據(jù)的,所以需要先請(qǐng)求到自己后臺(tái),然后重定向外鏈。2. 二維碼中鏈接如果太長(zhǎng),二維碼的點(diǎn)會(huì)很多,手機(jī)掃碼識(shí)別時(shí)間加長(zhǎng),需要設(shè)計(jì)短鏈接替換策略
1、vue前端
引用qrcode-lite
包生成二維碼
import { toDataURL } from 'qrcode-lite' ... const longUrl = 'http://h5.m.taobao.com/app/smg/index.html?a=1&b=2&c=3...' this.shortUrl = this.getShortUrl(longUrl) // 由長(zhǎng)鏈接獲取短鏈接 const qrOption = { width: 200, margin: 1, quality: 0.3 } this.getQrcodeImgURL(this.shortUrl, qrOption).then(url => { this.qrcodeImg = url }).catch((err) => { console.log(`Create qrcode img failed, ${err}`) })
2、laravel后臺(tái)
后臺(tái)主要實(shí)現(xiàn)3個(gè)功能,生成短鏈接、長(zhǎng)鏈接的緩存和取用、重定向
public function shortUrl(Request $request) { $url = $request->input('long_url'); if (!$url) { return response()->json([ 'code' => '-1', 'message' => 'The long_url is required!' ]); } $key = Carbon::now()->timestamp; // 以當(dāng)前時(shí)間戳作為緩存的key $expiresAt = Carbon::now()->addDays(10); // 短鏈接的有效時(shí)間為10天 Cache::put($key, $url, $expiresAt); return response()->json([ 'code' => '0', 'message' => 'Success short the url', 'data' => $key ]); } public function redirect($shortCode) { $key = $shortCode; if (!$key) { return view("common.error", [ "errorTitle" => "掃碼錯(cuò)誤", "errorMessage" => "二維碼錯(cuò)誤,請(qǐng)跟管理員確認(rèn)!"]); } $redirectUrl = Cache::get($key, 'expiration'); if ($redirectUrl == 'expiration') { return view("common.error", [ "errorTitle" => "掃碼錯(cuò)誤", "errorMessage" => "二維碼過(guò)期,請(qǐng)重新生成二維碼后再掃碼!"]); } // 記錄埋點(diǎn)數(shù)據(jù) ... return redirect()->away($redirectUrl); }
相關(guān)文章推薦:
二維碼登錄如何使用?總結(jié)二維碼登錄實(shí)例用法
二維碼在線生成圖片PHP源代碼
聲明:本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com