安卓如何实现指定url https代理

Question

我的安卓app是基于原生安卓外壳，然后使用webview 嵌入vue工程做ui，现在遇到一个问题，app为公司内部app，现在app内有一个页面需要走代理访问，其他的页面正常走公网即可，所以我在vue工程里面加了一个iframe显示一个页面，这个页面的请求需要单独走代理，请问如何实现

Answer 1

引自免费微信小程序：皆我百晓生

要在Android应用中实现特定URL的HTTPS代理，你需要在WebView中设置网络代理。这里是一个详细的步骤指南，包括必要的Java代码示例。

1. 首先，确保你的AndroidManifest.xml文件中有INTERNET权限：

<uses-permission android:name="android.permission.INTERNET" />

1. 在你的Activity中，创建一个新的WebSettings对象，并配置代理设置。下面的代码展示了如何设置全局代理（适用于所有网页）：

public class MainActivity extends AppCompatActivity {
    private WebView webView;
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        webView = findViewById(R.id.webView);

        // Create a WebSettings object and enable JavaScript
        WebSettings webSettings = webView.getSettings();
        webSettings.setJavaScriptEnabled(true);

        // Set the proxy settings
        Proxy proxy = new Proxy(Proxy.Type.HTTP, new InetSocketAddress("your_proxy_host", your_proxy_port));
        ConnectivityManager connectivityManager = (ConnectivityManager) getSystemService(Context.CONNECTIVITY_SERVICE);
        NetworkInfo networkInfo = connectivityManager.getActiveNetworkInfo();
        if (networkInfo != null && networkInfo.isConnected()) {
            System.setProperty("http.proxyHost", "your_proxy_host");
            System.setProperty("http.proxyPort", String.valueOf(your_proxy_port));
            System.setProperty("https.proxyHost", "your_proxy_host");
            System.setProperty("https.proxyPort", String.valueOf(your_proxy_port));
        }

        // Load your Vue app in the WebView
        webView.loadUrl("file:///android_asset/index.html");
    }
}

1. 对于只让特定页面通过代理，你需要在Vue.js应用中处理。为此，可以创建一个中间件来判断URL是否应该通过代理，并相应地调整请求。由于你提到使用了iframe来加载特定页面，我们可以尝试使用JavaScript操作DOM来修改iframe的src属性，使其指向代理服务器。以下是简单的Vue.js示例：

// main.js 或其他适当位置
import axios from 'axios';

const isProxyRequiredUrl = /your_regex_to_match_pages_requiring_proxy/;

// 创建一个axios实例，设置代理
const proxyAxiosInstance = axios.create({
  baseURL: 'https://your_proxy_server',
  proxy: {
    host: 'your_proxy_host',
    port: your_proxy_port,
  },
});

// 中间件检查请求URL并使用适当的axios实例
proxyAxiosInstance.interceptors.request.use(config => {
  if (isProxyRequiredUrl.test(config.url)) {
    config.baseURL = '';
    return config;
  } else {
    return config;
  }
}, error => Promise.reject(error));

// 将axios实例注入到Vue原型上供全局使用
Vue.prototype.$axios = proxyAxiosInstance;

// 在Vue组件中，根据需要使用$axios发送请求
export default {
  mounted() {
    this.$axios.get('your_page_requiring_proxy')
      .then(response => console.log(response.data))
      .catch(error => console.error(error));
  }
};

1. 对于iframe，你可以使用Vue.js中的ref属性来引用它，然后在Vue组件中动态更改其src属性。例如，在上述Vue组件中添加以下内容：

<template>
  <div>
    <iframe ref="proxyIframe" :src="getIframeSrc()" />
  </div>
</template>

<script>
export default {
  data() {
    return {
      iframeSrc: '',
    };
  },
  methods: {
    getIframeSrc() {
      if (isProxyRequiredUrl.test('/your_iframe_url')) {
        return '/your_iframe_url'; // 直接返回原始URL，因为已在axios中设置了代理
      } else {
        return 'https://your_proxy_server/your_iframe_url'; // 使用代理服务器转发
      }
    },
  },
  mounted() {
    this.iframeSrc = this.getIframeSrc(); // 初始化iframe src
  },
};
</script>

这样，当检测到需要代理的URL时，Vue.js应用将使用带有代理的axios实例进行请求，而iframe的src也将被动态设置为代理服务器转发后的URL。注意，这种方法可能受到同源策略限制，因此确保你的代理服务器支持CORS（跨源资源共享）。