uniapp+vue3微信公众号项目授权本地调式

引言:

最近开发一个微信公众号项目,需要授权登录,开发过这种项目的都知道,需要跳转到公众号后台配置的安全域名才能获取到code,而对于本地调式来说,这显而不适合,所以我们需要将本地项目运行的地址映射到线上,话不多说,上代码:

1.配置uniapp的manifest.json文件,代码如下:

"h5": {

    "router": {

      "mode": "history"

    },

    "domain": "http://example.com",//服务器地址(复制粘贴请去掉这段)

    "devServer": {

      "port": 80,

      "disableHostCheck": true

    }

  }

2.本地HOSTS文件(一般地址:C:\Windows\System32\drivers\etc),用管理员身份运行一个IED(代码编辑器)打开,添加一段配置:

127.0.0.1 example.com

example.com为你的回调地址,不要加http或者https协议头,一定记得不要在这行前面加#号,#号是注释,不生效的;

3.若是有vite.config.ts文件,代码如下:

import { defineConfig } from 'vite'

import uni from '@dcloudio/vite-plugin-uni'

// https://vitejs.dev/config/

export default defineConfig({

  build: {

    // 开发阶段启用源码映射:https://uniapp.dcloud.net.cn/tutorial/migration-to-vue3.html#需主动开启-sourcemap

    sourcemap: process.env.NODE_ENV === 'development',

  },

  plugins: [uni()],

  server: {

    host: '127.0.0.1',

    port: 8080,

    proxy: {

      '/api': {

        target: yourexample.com', //自定义域名(一定要配置到安全域名,不然无法回调)

        changeOrigin: true,

        rewrite: (path) => path.replace(/^\/api/, 'http://example.com的IP形式 '), // 这里直接写http://example.com的ip形式,这样就不用去弄两个域名了,让后端帮配置,能用ip访问到接口地址就行,记得请求接口的时候换成IP来请求,打包的时候换成域名形式就行;

      },

    },

  },

})

以上就是全部内容,若有一口或者错误,欢迎各位大佬指正!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容