Reference

  1. 微信文章图片防盗链处理方法

    一种是下载到本地,在通过本地文件访问,二是模拟请求

  2. 解决微信公众号文章的防盗链

    在html的head中加

    <meta name="referrer" content="never">

    会导致后端无法写入cookie,从而获取不到kmsid 的信息,导致无权限

  3. 前端黑科技-如何使用防盗链图片

    通过iframe 来实现的

    具体原理:
    防盗链图片,是被服务器判断了header中的referer的,但是如果referer=null,那就可以拿到图片了

    感觉可以通过webServer 改写 http://mmbiz.qpic.cn/ 下的请求的referer 来实现

  4. 处理微信文章中防盗链问题

    没试过,把链接添加到另一个链接的参数后面,感觉是转发下

  5. http-proxy-middleware插件解决开发中跨域、鉴权、图片防盗链问题

    里面讲到的图片防盗链问题,正式我要解决的问题,没看明白通过ajax.get 方式请求图片的处理逻辑

解决办法

通过js处理要显示图片的url,如果是微信文字图片,在http://mmbiz.qpic.cn/ 下的图片,替换成本地开发环境的域名 http://localhost:8000/wxi 。加的 wxi 在本地的devServer 做代理转发,设置header中的referer为空,devServer 配置代码:

 devServer: {
    // development server port 8000
    port: 8000,
    proxy: {
      '/wxi': {
        target: 'https://mmbiz.qpic.cn',
        pathRewrite: { '^/wxi': '/' },
        changeOrigin: true,
        headers: {
          referer: ''  // 设置header中的referer为空
        }
      }
    }
  },

苏茂林
110 声望4 粉丝

努力做个全栈吧!