springboot+vue:支付宝沙箱支付代码

以下是一个简单的Spring Boot和Vue.js应用程序中的支付宝沙箱支付代码示例：

在Spring Boot项目中：

1. 添加以下依赖：

<dependency>
    <groupId>com.alipay.sdk</groupId>
    <artifactId>alipay-sdk-java</artifactId>
    <version>4.3.0.ALL</version>
</dependency>

2. 创建一个包含支付宝配置信息的类，例如：

@Configuration
public class AlipayConfig {
    private String appId;
    private String privateKey;
    private String publicKey;
    private String notifyUrl;
    private String returnUrl;
    private String gatewayUrl;
    // getters and setters
}

3. 创建一个返回AlipayClient的方法：

@Bean
public AlipayClient getAlipayClient() {
    return new DefaultAlipayClient(
        alipayConfig.getGatewayUrl(),
        alipayConfig.getAppId(),
        alipayConfig.getPrivateKey(),
        "json",
        "UTF-8",
        alipayConfig.getPublicKey(),
        "RSA2"
    );
}

4. 在控制器中创建支付接口，例如：

@Autowired
private AlipayClient alipayClient;
@Autowired
private AlipayConfig alipayConfig;

@PostMapping("/pay")
public String pay(@RequestParam String orderNo, @RequestParam String amount) throws AlipayApiException {
    AlipayTradePagePayRequest alipayRequest = new AlipayTradePagePayRequest();
    alipayRequest.setReturnUrl(alipayConfig.getReturnUrl());
    alipayRequest.setNotifyUrl(alipayConfig.getNotifyUrl());
    alipayRequest.setBizContent("{\"out_trade_no\":\"" + orderNo + "\","
            + "\"total_amount\":\"" + amount + "\","
            + "\"subject\":\"" + "测试订单" + "\","
            + "\"body\":\"" + "测试订单" + "\","
            + "\"product_code\":\"FAST_INSTANT_TRADE_PAY\"}");
    String form = alipayClient.pageExecute(alipayRequest).getBody();
    return form;
}

在Vue.js中：

1. 创建一个按钮来启动支付流程：

<template>
  <div>
    <button @click="pay">Pay Now</button>
  </div>
</template>

2. 在脚本部分中创建一个调用支付接口的方法：

<script>
export default {
  methods: {
    pay() {
      axios.post('/api/pay', {
        orderNo: '123456',
        amount: '0.01'
      })
      .then(response => {
        let form = response.data;
        document.write(form); // 打开支付页面
      })
      .catch(error => {
        console.log(error);
      });
    }
  }
}
</script>

请注意，以上示例只适用于测试环境，如果您想在生产环境中使用支付宝支付，您需要进行更多的测试和配置。