.webp?table=collection&id=fff97571-0fee-81cf-8d7c-000bfde68952&t=fff97571-0fee-81cf-8d7c-000bfde68952&width=800&cache=v2){kind=small}
type
status
date
slug
summary
tags
category
icon
password
Recently, I've started exploring how to leverage AI for more tasks. After optimizing my blog with the help of Cursor, today I collaborated with ChatGPT to create an android app for LobeChat, enabling the usage of LobeChat via an app interface.
📝 Project Background
This app is an Android application designed for users who have set up their own LobeChat.
Currently, many services similar to ChatGPT or Claude are primarily web-based. However, restrictions related to privacy and usage limits often make shared accounts inconvenient, failing to meet daily usage needs effectively. This is especially true when sharing with family, friends, or colleagues. A self-hosted service combined with an API offers more flexibility. This app aims to provide a convenient Android entry point for such users, allowing them to utilize their self-built LobeChat services more easily.
Why Choose LobeChat
LobeChat is the second AIGC application I have deployed myself, the first being NextChat. I prefer the interface style of LobeChat, and it also offers a more comprehensive range of supported services compared to NextChat.
Why Create This Android App
I’m someone who loves using apps; if there is an app available, I would prefer it over web services or mini-programs. Although LobeChat offers a PWA option to install the web page as an app, I couldn’t find it in the app list. My usual habit is to search for apps in the list, which prompted me to create this app.
Another reason is that currently, neither NextChat nor LobeChat has an Android client. I wanted to try building one myself, get familiar with Android app development, and gain a deeper understanding of the current state of AIGC beyond surface-level questions like “What’s the weather today?” or “What does XXX mean?”
📝 Project Address
The client is fully open-source, with most of the code completed under the guidance of ChatGPT-4o. The overall idea is to wrap the LobeChat web service deployed on Vercel into an app using Webview. This should not pose much difficulty for experienced developers, but it was quite challenging for someone like me with no prior experience, resulting in a day full of trial and error.
Supported Features
- Use a custom LobeChat service address
- Support for image uploads
Permission Requests
Currently, there is one permission request:
- Network requests to access the LobeChat service web page.
How to Use
The download can be found in GitHub Releases. I'm still learning to use GitHub Action and Releases, as I'm a complete beginner.
I have tested it on Android 14 (API 34) and Android 12, and it works without issues. Compatibility with other versions has not yet been tested.
The app's performance largely depends on the target website's speed. If the target website is slow, the app may show a white screen while waiting.
About Backdoors
I'm sorry, but my current skill level hasn't reached a point where I can write backdoors. Even if I were to ask AI, I wouldn't know how to phrase the question. All the code is available on GitHub, and you can compile or modify it yourself.
🤗 Next Steps
There are still many issues to address:
Add refresh and back-to-home features in WebView.
Optimize caching and the WebView user experience.
Beautify the pages to align with LobeChat’s design.
Add a page loading progress bar to enhance the loading experience.
Optimize installation package updates; currently, it needs to be uninstalled and reinstalled.
Resolve the certificate issue with the installation package.
Currently, any URL opened in WebView, and I'm considering whether to restrict it to specific services.
Add a feature to auto-record custom URL addresses, avoiding manual input every time.
🤗 UPDATE
- feat: Add support for IP address:port access
- Update regex to support IP address format
- Improve URL handling logic for IP addresses
- Update error message to reflect supported formats
- fix: Allow cleartext HTTP traffic
- Add android:usesCleartextTraffic="true" to AndroidManifest.xml
- Fix err_cleartext_not_permitted error
- perf: Optimize regex performance
- Precompile regex patterns as constants
- Use precompiled URL_PATTERN and IP_PATTERN for matching
- Reduce CPU overhead on each button click
About the Development Process
The development process was very much influenced by a product manager mindset, as I have worked as a product manager since graduation. The overall development process was similar to usual work but more detailed, with a focus on business flow, prototypes, and documentation (mostly omitted). I communicated step by step with AI, testing and providing feedback on its responses. Instead of saying I was developing, it might be more accurate to say I was managing the product and testing, with AI handling the development through a trial-and-error approach.
After completing version 0.0.1, I've reflected on some thoughts: if I had approached the problem purely from a product standpoint, I would have faced many obstacles. Ignoring technical solutions could lead to a narrow focus. After all, the AI's understanding and advisory capabilities are nowhere near the developers I’ve worked with; it can't provide technical insights. Once a solution is selected, the development would continue in that direction, but the decision-making power lay in the hands of someone (me) who understands very little about technology. Fortunately, AI is patient; as long as the tokens are sufficient, there are no complaints.